'use strict'

// 等待初始化完毕
document.addEventListener('UniAppJSBridgeReady', () => {
  document.body.onclick = function () {
    return uni.postMessage({
      data: {
        action: 'onClick'
      }
    })
  }

  uni.postMessage({
    data: {
      action: 'onJSBridgeReady'
    }
  })
})
let options
let medias = []
/**
 * @description 获取标签的所有属性
 * @param {Element} ele
 */

function getAttrs(ele) {
  const attrs = Object.create(null)

  for (let i = ele.attributes.length; i--; ) {
    attrs[ele.attributes[i].name] = ele.attributes[i].value
  }

  return attrs
}
/**
 * @description 图片加载出错
 */

function onImgError() {
  if (options[1]) {
    this.src = options[1]
    this.onerror = null
  } // 取消监听点击

  this.onclick = null
  this.ontouchstart = null
  uni.postMessage({
    data: {
      action: 'onError',
      source: 'img',
      attrs: getAttrs(this)
    }
  })
}
/**
 * @description 创建 dom 结构
 * @param {object[]} nodes 节点数组
 * @param {Element} parent 父节点
 * @param {string} namespace 命名空间
 */

function createDom(nodes, parent, namespace) {
  const _loop = function _loop(i) {
    const node = nodes[i]
    let ele = void 0

    if (!node.type || node.type == 'node') {
      let { name } = node // svg 需要设置 namespace

      if (name == 'svg') namespace = 'http://www.w3.org/2000/svg'
      if (name == 'html' || name == 'body') name = 'div' // 创建标签

      if (!namespace) ele = document.createElement(name)
      else ele = document.createElementNS(namespace, name) // 设置属性

      for (const item in node.attrs) {
        ele.setAttribute(item, node.attrs[item])
      } // 递归创建子节点

      if (node.children) createDom(node.children, ele, namespace) // 处理图片

      if (name == 'img') {
        if (!ele.src && ele.getAttribute('data-src'))
          ele.src = ele.getAttribute('data-src')

        if (!node.attrs.ignore) {
          // 监听图片点击事件
          ele.onclick = function (e) {
            e.stopPropagation()
            uni.postMessage({
              data: {
                action: 'onImgTap',
                attrs: getAttrs(this)
              }
            })
          }
        }

        if (options[2]) {
          image = new Image()
          image.src = ele.src
          ele.src = options[2]

          image.onload = function () {
            ele.src = this.src
          }

          image.onerror = function () {
            ele.onerror()
          }
        }

        ele.onerror = onImgError
      } // 处理链接
      else if (name == 'a') {
        ele.addEventListener(
          'click',
          function (e) {
            e.stopPropagation()
            e.preventDefault() // 阻止默认跳转

            const href = this.getAttribute('href')
            let offset
            if (href && href[0] == '#')
              offset = (document.getElementById(href.substr(1)) || {}).offsetTop
            uni.postMessage({
              data: {
                action: 'onLinkTap',
                attrs: getAttrs(this),
                offset
              }
            })
          },
          true
        )
      } // 处理音视频
      else if (name == 'video' || name == 'audio') {
        medias.push(ele)

        if (!node.attrs.autoplay) {
          if (!node.attrs.controls) ele.setAttribute('controls', 'true') // 空白图占位

          if (!node.attrs.poster)
            ele.setAttribute(
              'poster',
              "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'/>"
            )
        }

        if (options[3]) {
          ele.onplay = function () {
            for (let _i = 0; _i < medias.length; _i++) {
              if (medias[_i] != this) medias[_i].pause()
            }
          }
        }

        ele.onerror = function () {
          uni.postMessage({
            data: {
              action: 'onError',
              source: name,
              attrs: getAttrs(this)
            }
          })
        }
      } // 处理表格
      else if (
        name == 'table' &&
        options[4] &&
        !ele.style.cssText.includes('inline')
      ) {
        const div = document.createElement('div')
        div.style.overflow = 'auto'
        div.appendChild(ele)
        ele = div
      } else if (name == 'svg') namespace = void 0
    } else ele = document.createTextNode(node.text.replace(/&amp;/g, '&'))

    parent.appendChild(ele)
  }

  for (let i = 0; i < nodes.length; i++) {
    var image

    _loop(i)
  }
} // 设置 html 内容

window.setContent = function (nodes, opts, append) {
  const ele = document.getElementById('content') // 背景颜色

  if (opts[0]) document.body.bgColor = opts[0] // 长按复制

  if (!opts[5]) ele.style.userSelect = 'none'

  if (!append) {
    ele.innerHTML = '' // 不追加则先清空

    medias = []
  }

  options = opts
  const fragment = document.createDocumentFragment()
  createDom(nodes, fragment)
  ele.appendChild(fragment) // 触发事件

  let height = ele.scrollHeight
  uni.postMessage({
    data: {
      action: 'onLoad',
      height
    }
  })
  clearInterval(window.timer)
  let ready = false
  window.timer = setInterval(() => {
    if (ele.scrollHeight != height) {
      height = ele.scrollHeight
      uni.postMessage({
        data: {
          action: 'onHeightChange',
          height
        }
      })
    } else if (!ready) {
      ready = true
      uni.postMessage({
        data: {
          action: 'onReady'
        }
      })
    }
  }, 350)
} // 回收计时器

window.onunload = function () {
  clearInterval(window.timer)
}
